<template>
  <node
    :title="config.name"
    :show-error="showError"
    :content="content"
    :error-info="errorInfo"
    @selected="selected"
    @delNode="delNode"
    @insertNode="insertNode"
    placeholder="请设置触发器"
    header-bgc="#35b881"
    header-icon="ele-Setup"
  />
</template>

<script>
import { computed, reactive, toRefs } from 'vue'
import Node from './Node.vue'
export default {
  name: 'TriggerNode',
  props: {
    config: {
      type: Object,
      default: () => {
        return {}
      },
    },
  },
  components: { Node },
  emits: ['selected', 'delNode', 'insertNode'],
  setup(props, context) {
    const { config } = toRefs(props)
    const state = reactive({
        showError: false,
        errorInfo: '',
    })
    const selected = () => {
        context.emit('selected')
    }
    const delNode = () => {
        context.emit('delNode')
    }
    const insertNode = (type) => {
        context.emit('insertNode', type)
    }
    const content = computed(() => {
        if (config.value.props.type === 'WEBHOOK') {
            return `发送${config.value.props.http.method}请求`
        } else {
            return '发送邮件'
        }
    })
    //校验数据配置的合法性
    const validate = (err) => {
        state.showError = false
        if (config.value.props.type === 'WEBHOOK') {
            if (isNotEmpty(config.value.props.http.url)) {
                state.showError = false
            } else {
                state.showError = true
                state.errorInfo = '请设置WEBHOOK的URL地址'
            }
        } else if (config.value.props.type === 'EMAIL') {
            if (
            !isNotEmpty(config.value.props.email.subject) ||
            config.value.props.email.to.length === 0 ||
            !isNotEmpty(config.value.props.email.content)
            ) {
                state.showError = true
                state.errorInfo = '请设置邮件发送配置'
            } else {
                state.showError = false
            }
        }
        if (state.showError) {
            err.push(`${config.value.name} 触发动作未设置完善`)
        }
        return !state.showError
    }
    return {
        ...toRefs(state),
        selected,
        delNode,
        insertNode,
        content,
        validate
    }
  }
}
</script>

<style>

</style>